{% extends "base_list.html" %}

{% block search_module %}
    <section class="content-header">
        <h1>
            {{ title }}
            <small>{{ title }}</small>
        </h1>
        <ol class="breadcrumb">
            <li><a href="#"><i class="fa fa-dashboard"></i> {{ title }}</a></li>
            <li class="active">{{ title }}</li>
        </ol>
    </section>
{%- endblock search_module %}

{% block list_body %}

    <style>

        .btn {

            display: inline-block;
            padding: 6px 2px 6px 0px;
            width: 50px;

            margin-bottom: 0;

            font-size: 10px;
            text-align: center;

        }
    </style>
    <div class="row">
        <div class="col-lg-12">
            <div class="panel panel-default">
                <div class="panel-body">
                    <div class="row mbh">

                        <div class="col-sm-12 dataTables_filter">
                        </div>

                    </div>

                    <div class="table-responsive">
                        <table class="table table-striped table-bordered table-hover" id="dataTables">
                            <thead>
                            <tr>
                                <th>课程体系id</th>
                                <th>课程体系</th>
                                <th>欣赏曲目数量</th>
                                <th>操作</th>
                            </tr>
                            </thead>
                            <tbody id="id-list">
                            </tbody>
                        </table>
                    </div>
                    <!-- /.dataTable_wrapper -->
                </div>
                <!-- /.panel-body -->
            </div>
            <!-- /.panel -->
        </div>
    </div> <!-- /.row -->
{% endblock list_body %}

{% block body_js %}
    <script type="text/javascript">
        function reset_status(id) {
            bootbox.confirm({
                size: "small",
                title: "发布状态",
                message: "确认更改",
                callback: function (result) {
                    if (result) {
                        $.ajax({
                            type: "POST",
                            url: "/video/reset_status/",
                            data: {
                                "id": id,
                                "csrfmiddlewaretoken": "{{ csrf_token }}",
                            },
                            dataType: "json",
                            success: function (data) {
                                search();
                            },
                        });
                    }
                }
            });
        }
        $(document).ready(function () {
            var table = $('#dataTables').dataTable({
                "dom": 'ltpr',
                "language": {
                    "url": "{{ static('lib/js/dataTable.Chinese.json') }}"
                },
                "responsive": true,
                "lengthChange": false,
                "serverSide": true,
                "ajax": {
                    url: "/score_enjoy/manage_datatable/",
                    type: "POST",
                    data: {
                        csrfmiddlewaretoken: "{{ csrf_token }}",
                    },
                },
                "columns": {{ list_fields.to_json()|safe }},
                "searchCols": [
                    {% for col in list_fields.to_list() -%}
                        {% if col.name in searches -%}
                            {{ searches[col.name]|jsonify|safe }},
                        {% else %}
                            null,
                        {%- endif %}
                    {%- endfor %}
                ],
                "columnDefs": [
                    {
                        "targets": [3],
                        "render": function (data, type, full, meta) {
                            console.log(data);

                            var edit = data.edit;
                            var opt = 'edit';
                            if (edit == '查看详情') {
                                opt = 'check'
                            }
                            console.log(data);
                            return '' +
                                '<a class="btn btn-primary" href="/score_enjoy/score_enjoy_manage_modify/' + data.course_sys_id + '/">' + edit + '</a>&nbsp;';

                            {#                    if(data.status == 1):#}
                            {#                     return '<a href="/score_enjoy/score_enjoy_list/score_enjoy_modify/'+data+'">编辑</a>';#}

                        },
                    },
                ],
                "order": [[0, 'desc']],
                "processing": true,
                "deferRender": true,
                {#
                {% if not searches -%}
                "deferLoading": true,
                {%- endif %}
                #}
                "pageLength": 10,
            });


            $('#function').change(function () {
                var $selAll = $('#select-allpage');
                if ($(this).val() == 'set_refunded') {
                    $selAll.removeAttr('checked');
                    $selAll.attr('disabled', 'disabled');
                } else {
                    $('#select-allpage').removeAttr('disabled');
                }
            });
            //=== search click ===
            $("#id-search-btn").on("keyup click", function () {
                search();
            });

            $("#id-th-checkbox").on("change", function () {
                $("#id-list").find("input[type=checkbox]").prop("checked", $(this).prop("checked"));
            });


            $("#select-allpage").on("click", function () {
                $("#id-th-checkbox").prop("checked", $("#select-allpage").prop("checked"));
                $("#id-list").find("input[type=checkbox]").prop("checked", $("#select-allpage").prop("checked"));
            });

        });
    </script>

{% endblock %}
